<template>
    <div class="con">
        <ul class="left">
          <li></li>
          <li></li>
          <li><a href="/website">返回主页</a></li>
          <li>详情</li>
          <li>卡牌对战</li>
          <li>小游戏</li>
        </ul>
    
        <ul class="right">
          <li>
          </li>
          <li><a href="/login">登录|注册</a></li>
          <li>APP下载</li>
        </ul>
    
      </div>

      <div align="center">
        <p>
        <table width="1326" border="0" cellspacing="0" cellpadding="0">
          <tr>
            <td colspan="5" rowspan="2" bgcolor="#FFFFFF"><video src="../assets/OP/pkm.mp4" width="1000" height="500"/></td>
            <td height="84" align="center" valign="middle" bgcolor="#FFFFFF" class="aaa"><img
                src="@/assets/t/celebrations.png" width="323" height="91" /></td>
          </tr>
          <tr>
            <td width="326" height="373" bgcolor="#FFFFFF" class="aa">
              <div align="center">
                <span class="aaa"><img src="@/assets/t/unite.png" width="323" height="91" /></span>
                <table width="308" height="321" border="0" cellpadding="0" cellspacing="0">
                  <tr>
                    <td width="308" bgcolor="#333333" scope="col"> <span class="a"> 其他剧集敬请期待....</span></td>
                  </tr>
                  <tr>
                    <td bgcolor="#F4F4F4"> 神奇宝贝！就决定是你了！</td>
                  </tr>
                  <tr>
                    <td bgcolor="#F4F4F4"> 神奇宝贝中心大对决！</td>
                  </tr>
                  <tr>
                    <td bgcolor="#F4F4F4"> 神奇宝贝 收服</td>
                  </tr>
                  <tr>
                    <td bgcolor="#F4F4F4"> 武士少年的挑战！</td>
                  </tr>
                  <tr>
                    <td bgcolor="#F4F4F4"> 尼比市的决战！</td>
                  </tr>
                  <tr>
                    <td bgcolor="#FFFFFF"></td>
                  </tr>
                  <tr>
                    <th height="40" bgcolor="#F4F4F4"><span class="X">特别剧场版</span></th>
                  </tr>
                  <tr>
                    <td bgcolor="#F4F4F4"> 宝可梦：皮卡丘和可可的冒险</td>
                  </tr>
                </table>
              </div>
            </td>
          </tr>
          <tr>
            <td colspan="5" bgcolor="#FFFFFF">
              <hr size="1" color="grey" width="1000">
            </td>
            <td bgcolor="#FFFFFF" class="aaa" style="text-align: center"></td>
          </tr>
          <tr>
            <td width="16" bgcolor="#FFFFFF" class="ab"></td>
            <td width="221" bgcolor="#FFFFFF" class="ab"><img src="@/assets/t/xx.jpg" width="221" height="310" /></td>
            <td width="26" bgcolor="#FFFFFF"></td>
            <td width="675" height="310" bgcolor="#FFFFFF">
              <p class="c"><strong> 精灵宝可梦 无印</strong></p>
              <p class="b">7863.1万播放  ·  235.1万弹幕  ·  205.5万系列追番</p>
              <p class="D">番剧 连载中</p>
              <p class="ziti"><span class="ziti"><span class="ziti"><span class="ziti"><span
                        class="ziti">《精灵宝可梦》动画改编自同名游戏，讲述了立志成为宝可梦大师的小智和皮卡丘结伴旅行的故事。</span></span></span></span>
              </p>
              <p class="ziti"><span class="ziti"><span class="ziti"><span class="ziti"><span
                        class="ziti">一路上，小智邂逅了不少同伴、劲敌、好友，和他们展开了一次又一次冒险。《精灵宝可梦 无印》共分为关都地区石英联盟、橘子群岛橘子联盟、城都地区城都联盟三个部分，因本作品无副标题，故又称为"无印"篇。</span></span><span
                      class="ziti"></span></span></span></p>
              <p class="D"></p>
              <div class="a" label-module="para" data-pid="5"></div>
            </td>
            <td width="62" bgcolor="#FFFFFF"></td>
            <td align="center" valign="middle" bgcolor="#FFFFFF" class="aaa" style="text-align: center">
              <table width="300" height="200" border="0" cellpadding="0" cellspacing="0">
                <tr>
                  <th height="68" bgcolor="#333333" class="ziti" scope="col">其他</th>
                </tr>
                <tr>
                  <th width="300" height="200" bgcolor="#CCCCCC" scope="col"><p>
                    <img src="@/assets/t/FsjM-RxWwAEHkBA.jpg" width="300" height="200" />
                    </p></th>
                </tr>
              </table>
            </td>
          </tr>
        </table>
        </p>
      </div>
          <div class="ending">
            <ul class="left1">
                <li></li>
                <li>
                    <div align="center">
                        <table width="1300" border="0" cellspacing="0" cellpadding="0">
                            <tr>
                                <td width="200" align="center" valign="middle" scope="col"><p>关于我们 </p>
                                    <p>联系我们</p>
                                    <p>用户协议</p>
                                    <p>加入我们</p>
                                </td>
                                <th width="96" valign="middle" scope="col"></th>
                                <td width="120" height="359" align="center" valign="middle" scope="col">
                                  <p>友情链接</p>
                                    <p>隐私政策</p>
                                    <p>专业认证</p>
                                    <p>投诉入口</p>
                              </td>
                                <th width="90" valign="middle" scope="col"></th>
                                <td width="120" align="center" valign="middle" scope="col">
                                  <p>协议总汇</p>
                                    <p>活动中心</p>
                                    <p>活动专题页</p>
                                    <p>侵权声诉</p>
                              </td>
                                <th width="105" valign="middle" scope="col"></th>
                                <td width="120" align="center" valign="middle" scope="col">
                                  <p>帮助中心</p>
                                    <p>用户反馈论坛</p>
                                    <p>壁纸站</p>
                                    <p>广告合作</p>
                              </td>
                                <th width="92" valign="middle" scope="col"></th>
                                <td width="120" align="center" valign="middle" scope="col">
                                  <p>名人堂</p>
                                    <p>MCN管理中心</p>
                                    <p>官方网址</p>
                                    <p>品牌号官方</p>
                              </td>
                                <th width="417" valign="middle" scope="col">
                                  <p><img src="@/assets/t/jiewei.png" width="419" height="199" /></p>
                              </th>
                          </tr>
                        </table>
                  </div>
                </li>
            </ul>
        </div>
</template>

<style>
body {
    list-style: none background-position center;
              background-repeat: no-repeat;
              background-attachment: fixed;
              background-size: 100%;
              background-image: url(@/assets/t/q2-2.jpg);
              text-align: center;
  }
  
            .ending {
              width: 100%;
              height: 350px;
              background-color: rgba(255, 255, 255);
              text-align: center;
              list-style: none;
          }
            li {
              list-style-type: none;
          }
      a:link {
        color: #FFF;
        text-decoration: none;
      }
  
      a:visited {
        text-decoration: none;
        color: #FFF;
      }
  
      a:hover {
        text-decoration: none;
        color: #FFF;
      }
  
      a:active {
        text-decoration: none;
        color: #FFF;
      }
  
      .con {
        width: 100%;
        height: 45px;
        background-color: rgba(63, 63, 63, 1.00);
        text-align: center;
        color: #FFF;
      }
  
      .left li {
        float: left;
        color: white;
        margin-right: 40px;
        list-style: none;
        margin-top: 10px;
        cursor: pointer;
      }
  
      .right li {
        float: right;
        color: white;
        margin-right: 40px;
        list-style: none;
        margin-top: 10px;
        cursor: pointer;
      }
  
      .center {
        cursor: pointer;
      }
  
      .a {
        font-size: 9px;
      }
  
      .a {
        font-size: 16px;
      }
  
      .b {
        color: #999;
        font-size: 14px;
      }
  
      .c {
        font-size: 36px;
      }
  
      .c strong {
        font-size: 24px;
      }
  
      .D {
        font-size: 12px;
      }
  
      .a .a {
        font-size: 12px;
      }
  
      .a .a {
        font-size: 12;
      }
  
      .a .a {
        font-size: 12px;
      }
  
      .ab {
        text-align: center;
      }
  
      .aaa {
        text-align: center;
        font-size: 300%;
      }
  
      .aa {
        text-align: center;
      }
  
      .aaa table tr th {
        font-size: 36px;
        font-weight: bold;
        text-align: center;
        color: #FFF;
      }
  
      .aa table {
        text-align: left;
      }
  
      .X {
        font-size: 24px;
      }
  
      bai {
        color: #FFF;
      }
  
      .a {
        color: #FFF;
      }
  
      .z {
        color: #2D1434;
      }
  
      .hei {
        color: #000;
      }
  
      .a .a {
        color: #000;
      }
  
      .ziti {
        font-size: 9px;
      }
  
      .ziti {
        font-size: 36px;
      }
  
      .ziti {
        font-size: 16px;
      }
  
      .ziti .ziti .ziti .ziti {
        color: #CCC;
      }
  
      .ziti .ziti .ziti .ziti .ziti {
        color: #666;
      }
</style>
